<template>
  <div id="personal-amendregister">
    <NavBar title="修改登录密码" left-arrow @click-left="onClickLeft" />
    <div class="amendregister-box">
      <Form @submit="onSubmit">
        <Field
          v-model="forpassword"
          type="password"
          name="旧密码"
          label="旧密码"
          placeholder="旧密码"
          class="field"
        />
        <Field
          v-model="newpassword"
          type="password"
          name="新密码"
          label="新密码"
          placeholder="设置新密码"
          class="field"
        />
        <Field
          v-model="repassword"
          type="password"
          name="确认密码"
          label="确认密码"
          placeholder="请在次输入密码"
          class="field"
        />
        <div class="btn">
          <Button round block type="info" native-type="submit">确定</Button>
        </div>
      </Form>
    </div>
  </div>
</template>
<script>
import { NavBar, Field, Form, Button } from "vant";
export default {
  components: {
    NavBar,
    Field,
    Form,
    Button
  },

  data() {
    return {
      forpassword: "", // 旧密码
      newpassword: "", // 新密码
      repassword: "", // 确认密码
    };
  },

  // 创建时
  created() {},

  // 方法
  methods: {
    // 跳出
    onClickLeft() {
      console.log("跳出");
      this.$router.go(-1);
    },

    // 修改登录密码
    onSubmit(values) {
      console.log("submit", values);
    },

    // 网络请求
  },
};
</script>
<style lang="less" scoped>
#personal-amendregister {
  width: 100vw;
  height: 100vh;
  .amendregister-box {
    width: 100%;
    .field {
      margin-top: 10px;
    }
    .btn {
      width: 350px;
      height: 40px;
      margin: 30px auto;
    }
  }
}
</style>
